 /* 页面主体 */
 .container {
     display: flex;
     justify-content: center;
     margin-top: 93px;
 }

 /* 左侧内容 */
 .step-wrap {
     flex: 1;
 }

 /* 时间轴 */
 .cx-time-main {
     width: 100%;
     height: auto;
     padding: 20px 0;
 }

 .cx-time-box {
     position: relative;
     width: 100%;
     /* height: auto; */
 }

 .cx-time-main ul li {
     position: relative;
     padding: 18px 0;
 }

 .cx-time-main ul li:nth-child(2n) {
     padding-left: 58.5%;
     text-align: left;
 }

 .cx-time-main ul li:nth-child(2n+1) {
     padding-right: 58.5%;
     text-align: right;
 }

 .cx-time-main ul li:nth-child(2n+1) .cx-main-box::after {
     left: auto;
     right: calc(50% + 4px);
 }

 .cx-time-main ul li::before,
 .cx-time-main ul li::after {
     content: '';
     position: absolute;
     top: 0;
     height: calc(50% - 0px);
     left: 50%;
     margin-left: -2px;
     width: 9px;
     background: #B2E2EE;
     /* box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3); */
     /* border-radius: 4px; */
     z-index: -2;
 }

 .cx-time-main ul li::after {
     top: auto;
     bottom: 0;
 }

 /* 时间轴上下圆角效果 */
 .cx-time-main ul li:first-child::before {
     border-top-left-radius: 4px;
     -moz-border-top-left-radius: 4px;
     -webkit-border-top-left-radius: 4px;
     border-top-right-radius: 4px;
     -moz-border-top-right-radius: 4px;
     -webkit-border-top-right-radius: 4px;
 }

 .cx-time-main ul li:last-child:after {
     border-bottom-left-radius: 4px;
     -moz-border-bottom-left-radius: 4px;
     -webkit-border-bottom-left-radius: 4px;
     border-bottom-right-radius: 4px;
     -moz-border-bottom-right-radius: 4px;
     -webkit-border-bottom-right-radius: 4px;
 }

 /* 内容块 */
 .cx-main-box {
     display: inline-block;
     min-width: 40%;
     box-sizing: border-box;
     padding: 10px 20px;
     cursor: default;
     width: 100%;
     min-height: 46px;
     line-height: 1.5;
     text-align: left;
     border: 1px solid #DDD;
     box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     border-radius: 7px;
 }

 .cx-main-box:hover {
     background: #009FC5;
 }

 .cx-main-box::before {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     width: 13px;
     height: 13px;
     margin: -7px 0 0 -4px;
     border: 2px solid #009FC5;
     border-radius: 50%;
     z-index: 9999;
     box-sizing: border-box;
 }

 .cx-main-box::after {
     content: '';
     position: absolute;
     top: calc(50% - 1px);
     left: calc(50% + 6px);
     width: calc(8.5% - 5px);
     height: 2px;
     background: #009FC5;
     border-radius: 0px;
 }

 .cx-main-box>div {
     width: 100%;
     white-space: initial;
 }

 /* 右侧 */
 .teammate {
     width: 421px;
     height: 353px;
     border: 1px solid #DDD;
     box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     border-radius: 80px;
     margin-left: 78px;
     text-align: center;
     color: #333;
     padding: 37px;
     box-sizing: border-box;
 }

 .teammate .tit {
     height: 16px;
     font-size: 16px;
     font-weight: bold;
 }

 /* 队友列表 */
 .persons>li {
     padding: 18.5px 0px;
     display: flex;
     align-items: center;
     justify-content: space-around;
 }

 .persons li .logo {
     width: 46px;
     height: 46px;
     border-radius: 4px;
     margin-right: 10px;
 }

 .persons li>div {
     width: 75px;
     min-height: 35px;
     line-height: 35px;
     font-size: 13px;
     border: 1px solid #DDD;
     box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     border-radius: 4px;
 }

 .persons .resume {
     position: relative;
     cursor: default;
 }

 .resume .r-detail {
     display: none;
     position: absolute;
     top: 42px;
     left: 50%;
     transform: translate(-50%, 0%);
     width: 155px;
     min-height: 120px;
     background: #FFFFFF;
     border: 1px solid #009FC5;
     box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     z-index: 1;
 }

 /* 鼠标移入时显示内容框 */
 .persons .resume:hover .r-detail {
     display: block;
 }

 /* 三角形 */
 .resume .r-detail::before {
     content: '';
     width: 0px;
     height: 0px;
     border: 10px solid;
     border-color: transparent transparent #009FC5 transparent;
     position: absolute;
     top: -20px;
     left: 50%;
     transform: translate(-50%, 0px);
 }

 .resume .r-detail::after {
     content: '';
     width: 0px;
     height: 0px;
     border: 10px solid;
     border-color: transparent transparent #FFF transparent;
     position: absolute;
     top: -19px;
     left: 50%;
     transform: translate(-50%, 0px);
 }

 /* 提示框 */
 .tip-wrap {
     width: 421px;
     min-height: 135px;
     background: #FFFFFF;
     border: 1px solid #DDD;
     box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     padding: 28px;
     margin-left: 78px;
     margin-top: 112px;
     box-sizing: border-box;
 }
 .tip-wrap .tit{
    font-size: 15px;
    color: #333;
    margin-bottom: 26px;
    text-align: center;    
 }
 .tip-wrap .txt {
    font-size: 13px;
    color: #656565;
    line-height: 2;
}
 .tip-wrap .txt i{
    color: #009FC5;
}